/**
 * Created by python on 19-2-27.
 */
let vm = new Vue({
    el: '#app',
    data: {
        host: HOST,

        // register
        register_error_name: false,
        register_error_password: false,
        register_error_phone: false,
        register_error_allow: false,
        register_error_sms_code: false,
        register_error_name_message: '',
        register_error_phone_message: '',
        register_error_sms_code_message: '',

        sms_code_tip: '获取验证码',
        sending_flag: false, // 正在发送短信标志

        register_nickname: '',
        register_password: '',
        register_mobile: '',
        register_sms_code: '',
        register_allow: false,

        // login
        login_error_password: false,
        login_error_phone: false,
        login_error_phone_message: '',
        login_error_password_message: '',

        login_mobile: '',
        login_password: '',
        login_allow: false  // 记住登陆状态
    },
    mounted: function(){

    },
    methods: {
        // 获取url路径参数
        get_query_string: function(name){
            let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
            let r = window.location.search.substr(1).match(reg);
            if (r != null) {
                return decodeURI(r[2]);
            }
            return null;
        },
        // 注册
        register_check_nickname: function (){
            // 用户名长度判断
            let len = this.register_nickname.length;
            if(len<3||len>20) {
                this.register_error_name_message = '请输入3-20个字符的用户名';
                this.register_error_name = true;
            } else {
                this.register_error_name = false;
            }
        },
        register_check_pwd: function (){
            // console.log('验证密码');
            let len = this.register_password.length;
            if(len<6||len>20){
                this.register_error_password = true;
            } else {
                this.register_error_password = false;
            }
        },
        register_check_phone: function (){
            // console.log('验证手机');
            let re = /^1[345789]\d{9}$/;
            if(re.test(this.register_mobile)) {
                axios.get(this.host + '/mobiles/'+ this.register_mobile + '/count/', {
                        responseType: 'json'
                    })
                    .then(response => {
                        if (response.data.count > 0) {
                            this.register_error_phone_message = '手机号已存在';
                            this.register_error_phone = true;
                            console.log('sms:'+this.register_error_phone);
                        } else {
                            this.register_error_phone = false;
                        }
                    })
                    .catch(error => {
                        console.log(error.response.data);
                    })
            } else {
                this.register_error_phone_message = '您输入的手机号格式不正确';
                this.register_error_phone = true;
            }

        },
        register_check_sms_code: function (){
            // console.log('验证短信验证码');
            if(!this.register_sms_code){
                this.register_error_sms_code_message = '请填写短信验证码';
                this.register_error_sms_code = true;
            } else {
                this.register_error_sms_code = false;
            }

        },
        register_check_sms_code_tip: function (){
            // console.log('验证短信验证码');
            if(!this.register_sms_code){
                this.register_error_sms_code_message = '请填写短信验证码';
                this.register_error_sms_code = true;
            } else {
                this.register_error_sms_code = false;
            }

        },
        send_sms_code: function () {
            if (this.sending_flag == true) {
                return;
            }
            this.sending_flag = true;

            this.register_check_phone();
            if(this.register_error_phone == false){
                // 向后端请求发送短信验证码
                axios.get(HOST+'/sms_codes/' + this.register_mobile,{
                    responseType: 'json'
                })
                .then(response => {
                    // 表示后端发送短信成功
                    // 倒计时60秒，60秒后允许用户再次点击发送短信验证码的按钮
                    let num = 60;
                    // 设置一个计时器
                    let t = setInterval(() => {
                        if (num == 1) {
                            // 如果计时器到最后, 清除计时器对象
                            clearInterval(t);
                            // 将点击获取验证码的按钮展示的文本回复成原始文本
                            this.sms_code_tip = '获取验证码';
                            // 将点击按钮的onclick事件函数恢复回去
                            this.sending_flag = false;
                        } else {
                            num -= 1;
                            // 展示倒计时信息
                            this.sms_code_tip = num + '秒';
                        }
                    }, 1000, 60)
                })
            }


        },

        register_check_allow: function (){
            // console.log('验证协议');
            if(!this.register_allow) {
                this.register_error_allow = true;
            } else {
                this.register_error_allow = false;
            }
        },

        // create_resume: function (use_id) {
        //     // 生成用户简历信息
        //     axios.post(HOST+'/resume/',
        //         {
        //             user : this.user_id,
        //         },{
        //
        //         responseType: 'json'
        //     })
        // },

        register_on_submit: function(){
            console.log('提交了表单');
            this.register_check_nickname();
            this.register_check_pwd();
            this.register_check_phone();
            this.register_check_sms_code();
            this.register_check_allow();
            if(this.register_error_name == false && this.register_error_password == false
                && this.register_error_phone == false && this.register_error_sms_code == false && this.register_error_allow == false) {
                console.log('即将发送异步请求');
                axios.post(this.host + '/users/', {
                        nickname: this.register_nickname,
                        password: this.register_password,
                        mobile: this.register_mobile,
                        sms_code: this.register_sms_code,
                        allow: this.register_allow.toString()
                    }, {
                        responseType: 'json'
                    })
                    .then(response => {
                        // 记录用户的登录状态
                        sessionStorage.clear();
                        localStorage.clear();
                        sessionStorage.token = response.data.token;
                        sessionStorage.nickname = response.data.nickname;
                        sessionStorage.user_id = response.data.id;
                        // this.create_resume(user_id);
                        location.href = '/index.html';


                    })
                    .catch(error=> {
                        if (error.response.status == 400) {
                            if ('non_field_errors' in error.response.data) {
                                this.register_error_sms_code_message = error.response.data.non_field_errors[0];
                            } else {
                                this.register_error_sms_code_message = '数据有误';
                            }
                            this.register_error_sms_code = true;
                        } else {
                            console.log(error.response.data);
                        }
                    })
            }

        },

        // 登陆
        login_check_phone: function (){
            // console.log('验证手机');
            let re = /^1[345789]\d{9}$/;
            let re2 = /^[a-zA-Z0-9_]{4,20}@(163|126|qq|sina|yahoo)\.com$/;
            if(re.test(this.login_mobile) || re2.test(this.login_mobile)) {
                this.login_error_phone = false;
            } else {
                this.login_error_phone_message = '手机号或邮箱格式不正确';
                this.login_error_phone = true;
            }

            if (this.login_error_phone == false) {
                axios.get(this.host + '/mobiles/'+ this.login_mobile + '/count/', {
                        responseType: 'json'
                    })
                    .then(response => {
                        if (response.data.count == 0) {
                            this.login_error_phone_message = '没有此账户';
                            this.login_error_phone = true;
                        } else {
                            this.login_error_phone = false;
                        }
                    })
                    .catch(error => {
                        console.log(error.response.data);
                    })
            }
        },
        login_check_pwd: function (){
            // console.log('验证密码');
            let len = this.login_password.length;
            if(len<6||len>20){
                this.login_error_password_message = '密码最少6位，最长20位';
                this.login_error_password = true;
            } else {
                this.login_error_password = false;
            }
        },
        login_on_submit: function(){
            console.log('提交了登陆表单');
            this.login_check_phone();
            this.login_check_pwd();


            if (this.login_error_phone == false && this.login_error_password == false) {
                axios.post(this.host+'/authorizations/', {
                        username: this.login_mobile,
                        password: this.login_password
                    }, {
                        responseType: 'json',
                        withCredentials: true
                    })
                    .then(response => {
                        // 使用浏览器本地存储保存token
                        if (this.login_allow) {
                            // 记住登录
                            sessionStorage.clear();
                            localStorage.clear();
                            localStorage.token = response.data.token;
                            localStorage.user_id = response.data.user_id;
                            localStorage.nickname = response.data.nickname;
                        } else {
                            // 未记住登录
                            localStorage.clear();
                            localStorage.clear();
                            sessionStorage.token = response.data.token;
                            sessionStorage.user_id = response.data.user_id;
                            sessionStorage.nickname = response.data.nickname;
                        }

                        // 跳转页面
                        let return_url = this.get_query_string('next');
                        if (!return_url) {
                            return_url = '/index.html';
                        }
                        location.href = return_url;
                    })
                    .catch(error => {
                        if (error.response.status == 400) {
                            this.login_error_password_message = '用户名或密码错误';
                        } else {
                            this.login_error_password_message = '服务器错误';
                        }
                        this.login_error_password = true;
                    })
            }
        },
        qq_login: function(){
            var next = this.get_query_string('next') || '/';
            axios.get(this.host + '/oauth/qq/authorization/?next=' + next, {
                    responseType: 'json'
                })
                .then(response => {
                    location.href = response.data.login_url;
                })
                .catch(error => {
                    console.log(error.response.data);
                })
        }
    }
});
